<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
	<title>主页</title>
<style type="text/css" media="screen">
   *{margin: 0;padding: 0;}
   body{font-family: 微软雅黑; margin:0 auto;}
      .topbar{margin:0 auto;
         width: 1349px; 
         height: 120px;
         background:#fffd88;
      }
      .box{margin:0 auto;width:1349px;}
      .content1{
         width: 305px;
         height: 600px;
         background: #FFFD88;
         float: left;

         }

      .content2{
         width: 1042px;
         height: 600px;
         float: right;
         border-left: 2px solid #FFD478;
         border-top:2px solid #ffd478;
         border-radius: 5px;
         
      }
      
      .topnav{
         width: 1349px;
         height: 30px;
         list-style: none;
         background:#D7FFDF;
         text-align: center;
         line-height: 2em;}

      .topnav li{position: relative;
         display: inline-block;
         padding: 0 20px;
         list-style: none outside none;
      }
.topnav li:not(:last-of-type):after{
content:"";width:1px;
height:16px;
position:absolute;
top:50%;
margin-top:-8px;
right:0;
background-image:linear-gradient(to bottom,#999,#666);
      }


      .topnav li a{text-decoration: none; 
                  color: black;}
      .topnav li a:hover{color:green;}

      .topnav a{
        display: inline-block;
        -webkit-transition: all 0.2s ease-in;
        -moz-transition: all 0.2s ease-in;
        -o-transition: all 0.2s ease-in;
        -ms-transition: all 0.2s ease-in;
        transition: all 0.2s ease-in;
      }
      .topnav a:hover{
        -webkit-transform:rotate(5deg);
        -moz-transform:rotate(5deg);
        -o-transform:rotate(5deg);
        -ms-transform:rotate(5deg);
        transform:rotate(5deg);
      }

      .log{width: 305px;
         height: 50px;
         line-height: 3em;
         background-image:linear-gradient(to right,orange,white);
          text-align: center;
          border-top:2px solid #ffd478;}
          
          .table1{margin: 40px;}
        .login{margin:10px 0 10px 0;
                  }
       .login:hover{  background: #ffd478;}
          .go{width: 100px; height: 30px;
           position: relative;
           left:48px;
            top:-22px; 
              margin-left: 3px;
         }
         .foot{width: 1349px;
            margin:0 auto;
            height: 40px;
            overflow: hidden;
            background: #eee;
             border-top:1px dotted #999;
             position: relative;left: 0;}
             .meau{width: 305px;height: 40px; 
               background: white;
               border-radius: 20px;
               text-align: center;
               line-height: 2.5em;
               position: relative;top:45px;
               border:1px dotted orange;
            }
             h3{letter-spacing: 20px;color:black;}
             p{line-height: 2em;}
             .word{width: 800px;margin:10px auto; }
             .party{width:910px; height: 360px; border: 2px solid red; margin:30px auto;
               background: orange}
             caption{width:910px; 
               border-top: 2px solid red;
               border-left:2px solid red;  
               border-right: 2px solid red;
               background: orange;}
               .party td{border:1px solid red; 
                  text-align: center;
               }
            footer{margin:0 auto;width:1349px; height: 10px; background: #fffd88; overflow: hidden;}
</style>
	<script type="text/javascript">
    
	</script>
</head>
<body>

	<div class="topbar">
      <div class="nav">
      <ul class="topnav">
         <li><a href="#">酒店简介</a></li>
         <li><a href="#">酒店动态</a></li>
         <li><a href="#">客房提示</a></li>
         <li><a href="#">餐饮设施</a></li>
         <li><a href="#">康体娱乐</a></li>
         <li><a href="#">商务中心</a></li>
         <li><a href="#">服务设施</a></li>
         <li><a href="#">留言板</a></li>
         <li><a href="#">网上订购</a></li>
         <li><a href="#">网上订餐</a></li>
         <li><a href="#">后台管理</a></li>
         </ul>
     </div>
     <div class="meau">
        <h3>餐饮设施</h3>
     </div>
   </div>

   <div class="box">
      <div class="content1">
        <div class="log">
           <h2>管理员入口</h2>
        </div>
      
          <form>
             <table class="table1">
                <tr><td>用户名&nbsp;</td><td><input class="login" type="text" name="name"></td></tr>
                <tr><td>密&nbsp;&nbsp;&nbsp;码&nbsp;</td><td><input class="login" type="password" name="pwd"></td></tr>
             </table>
             <input class="go" type="submit" value="登录"/>
             <input class="go" type="reset" value="重置"/>
          </form>   
   <div class="log">
           <h2>邮箱登录</h2>
        </div>
        <form>
             <table class="table1">
                <tr><td>用户名&nbsp;</td><td><input class="login" type="text" name="name"></td></tr>
                <tr><td>密&nbsp;&nbsp;&nbsp;码&nbsp;</td><td><input class="login" type="password" name="pwd"></td></tr>
             </table>
             <input class="go" type="submit" value="登录"/>
             <input class="go" type="reset" value="重置"/>
          </form>   
      </div>

      <div class="content2">
      <div class="word">
         <p>
         &nbsp;&nbsp;&nbsp;酒店为您提供完备的餐饮服务，酒店拥有中餐厅，西餐厅，宴会厅，日本餐，满景轩和各式包房，烹饪精湛，环境优雅，为您提供多种风味菜肴。
         <br>
         &nbsp;&nbsp;&nbsp;酒店拥有多个不同规模的餐厅和宴会厅，可以提供零点，团队，会议餐，中西自助餐，中高档宴会和酒会，喜庆婚宴等。环境优雅，格调清新，烹饪精湛，色香味美，食客先尝为快。
         &nbsp;&nbsp;&nbsp;酒店为您提供完备的餐饮服务，酒店拥有中餐厅，西餐厅，宴会厅，日本餐，满景轩和各式包房，烹饪精湛，环境优雅，为您提供多种风味菜肴。
         </p>
<hr>
      </div>
      <table class="party">
         <caption>喜庆晏</caption>
         <tr>
            <td>菜单1<br>每席：1100元</td>
            <td>菜单2<br>每席：1398元</td>
            <td>菜单3<br>每席：1888元</td>
         </tr>
      </table>
      </div>
</div>

<div class="foot"></div>
<footer></footer>
</body>
</html>